<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>layui</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <link rel="stylesheet" href="http://127.0.0.1:801/ui2/layui/css/layui.css"  media="all">
<!--   <script src="http://127.0.0.1:801/ui2/layui/layui.all.js" charset="utf-8"></script> -->
  <script src="http://127.0.0.1:801/ui2/layui/layui.js" charset="utf-8"></script>
  <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
</head>
<body>
 

 
<!-- layui-nav-tree -->
    
<ul class="layui-nav layui-nav-tree" >
    <li data-name="home" class="layui-nav-item">
        <a href="javascript:;" lay-tips="主页" lay-direction="2">
            <i class="layui-icon layui-icon-home"></i>
            <cite>主页</cite>
            <span class="layui-nav-more"></span></a>
        <dl class="layui-nav-child">
            <dd data-name="console" class="layui-this">
                <a lay-href="home/console.html">控制台</a>
            </dd>
        </dl>
    </li>
    <li data-name="component" class="layui-nav-item layui-nav-itemed">
        <a href="javascript:;" lay-tips="组件" lay-direction="2">
            <i class="layui-icon layui-icon-component"></i>
            <cite>组件</cite>
            <span class="layui-nav-more"></span></a>
        <dl class="layui-nav-child">
            <dd data-name="grid">
                <a href="javascript:;">栅格<span class="layui-nav-more"></span></a>
                <dl class="layui-nav-child">
                    <dd data-name="list">
                        <a lay-href="component/grid/list.html">等比例列表排列</a>
                    </dd>
                    <dd data-name="mobile">
                        <a lay-href="component/grid/mobile.html">按移动端排列</a>
                    </dd>
                </dl>
            </dd>
            <dd data-name="button">
                <a lay-href="component/button/index.html">按钮</a>
            </dd>
        </dl>
    </li>
</ul>
 


</body>
<script>
//注意：导航 依赖 element 模块，否则无法进行功能性操作
layui.use('element', function(){
  var element = layui.element;
  
  //…
});


//$('#navBar > ul > li.layui-nav-item > dl > li.layui-nav-item a').on('click', function(e){if($($(this).parents('li')[0]).hasClass('.layui-nav-itemed')){$($(this).parents('li')[0]).removeClass('.layui-nav-itemed')}else {$($(this).parents('li')[0]).addClass('.layui-nav-itemed')}})
</script>
</html>